<!DOCTYPE html> <!-- 页面类型文档说明，表示告诉浏览器这是HTML5的规范 -->
<!--1.标签 - 承载内容-->
<!--2.层叠样式表 css cascading style sheet- 渲染页面-->
<!--3.Javascript-->
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>第一个HTML文件</title>
        <style>
            h1 {
                color:red;
                font-size: 2cm;
                font-family: "Microsoft YaHei UI";
            }
            p {
                font-size: 1cm;
            }
            p:first-letter {
                font-size: 1.2cm;
                color: blue;
            }
            .a {
                color: green;
            }
            .b {
                color: red;
            }
        </style>
    </head>
    <body>
        <!-- 描点坐标 -->
        <a name="top"></a>
        <h1>一级标题</h1>
        <hr> <!-- # 水平分割线-->
         <p class="a">12345</p> <br> <!-- # 折行标签，没有结束标签/，一般里面不装内容的标签，都不需要/ -->
         <p class="b">12345</p> <!-- b表示标签的属性 -->
        <p>段落</p> <!-- # 段落标签，相当于这句话为段落，段落这间会存在间距 -->
         <p>12345</p>
         <h1>12345</h1>
        <button onclick="showWriter()">确定</button> <!-- 按钮标签 --> <br>
        <script>
            function showWriter(){
                window.alert('作者:whx')
            }
        </script>

        <sub>下标 &nbsp;</sub>
        <sup>上标 &nbsp;</sup>
        <em>斜体 &nbsp;</em>
        <strong>加粗 &nbsp;</strong>
        <del>删除线 &nbsp;</del>
        <ins>&lt; &gt; &copy; 下划线 &nbsp;</ins>

        <h2>有序列表</h2>
        <ol>
            <li>1</li>
            <li>2</li>
            <li>3</li>
            <li>4</li>
        </ol>

        <h2>无序列表</h2>
        <ul>
            <li>1</li>
            <li>2</li>
            <li>3</li>
            <li>4</li>
        </ul>

        <h2>定义列表</h2>
        <dl>
            <dt>Python</dt>
            <dd>python的描述1</dd> <!-- 描述-->
            <dd>python的描述2</dd>
            <dd>python的描述3</dd>
        </dl>

        <h2>页面链接</h2>
        <h2>张三喜欢的网站超链接</h2>
        <ul>
            <li><a href="http://www.baidu.com">百度</a></li>
<!--            默认在当前页面打开超链接，要target _blank设置打开新网页-->
            <li><a href="https://www.jd.com" target="_blank">京东</a></li>
            <li>
                视频网站
                <ol>
                    <li>优酷</li>
                    <li>爱奇艺</li>
                    <li>腾讯视频</li>
                </ol>
            </li>
        </ul>

        <h2>描点链接</h2>
        <h3><a href="#top">回顶部</a></h3>
        <h3><a href="hello.html#foo">挑战到hello页面的描点</a></h3>

        <h2>功能链接</h2>
        <a href="mailto:1598260045@qq.com">联系站长</a>
    https://mail.qq.com/cgi-bin/frame_html?sid=2JVFVdaEJmXoIH8g&r=66ef7c11c9a029342bed227b2eaaacc4
    </body>
</html>